<template>
    <div style="background: rgb(254,254,254);padding-top: 59px;">
        <div class="top_panel">
            <div class="w centerauto line_h_80">
                <router-link to="/publishtype">
                    <i class="el-icon-back"></i>
                    <span class="icon_title line_h_80">{{editState ? '编辑' : '发布'}}项目</span>
                </router-link>
            </div>
        </div>
        <div class="mtb_large">
            <div class="w centerauto">
                <el-row :gutter="20">
                    <el-col :span="18">
                        <el-form ref="form" :rules="formrules" :model="form" label-width="80px">
                            <div class="panel mt_large">
                                <div class="item_title flexbox spacebetween">
                                    <p>基本信息</p>
                                    <p style="line-height: 45px;padding-right:16px;font-size: 15px;font-weight: 400;">应用类型：{{appname}}<router-link to="/publishtype" style="color: #2093ff;margin-left: 15px;">修改</router-link></p>
                                </div>
                                <div class="padding_16">
                                    <el-form-item label="项目名称" prop="p_name">
                                        <el-input v-model="form.p_name" placeholder="请输入项目名称"></el-input>
                                    </el-form-item>
                                    <el-form-item label="需求描述" prop="p_content">
                                        <quill-editor v-model="form.p_content" ref="myQuillEditor" :options="editorOption" placeholder="请输入需求描述，最多不超过8000字">
                                        </quill-editor>
                                    </el-form-item>
                                    <el-form-item label="附件">
                                        <el-upload ref="upload" class="upload-demo" drag action="string" :http-request="UploadImage" :on-remove="handleRemove" :on-change="uploadChange" :on-success="uploadSuccess" :file-list="filelistarr" :before-upload="beforeAvatarUpload">
                                            <i class="el-icon-upload"></i>
                                            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em>，总大小不超过15MB，最多5个文件</div>
                                            <div class="el-upload__tip" slot="tip"></div>
                                        </el-upload>
                                    </el-form-item>
                                    <el-form-item label="岗位需求">
                                        <el-select v-model="form.p_job_demand_arr" multiple placeholder="请选择" style="width: 100%;">
                                            <el-option v-for="item in workOpt" :key="item.st_id" :label="item.st_name" :value="item.st_id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item label="技能要求" prop="p_skills_arr">
                                        <el-select v-model="form.p_skills_arr" multiple placeholder="请选择一项或多项技能" style="width: 100%;">
                                            <el-option v-for="item in skillOpt" :key="item.st_id" :label="item.st_name" :value="item.st_id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </div>
                            </div>
                            <div class="panel mt_large">
                                <p class="item_title">周期及预算</p>
                                <div class="padding_16">
                                    <el-row>
                                        <el-col :span="12">
                                            <el-form-item label="周期" prop="p_cycle">
                                                <el-input placeholder="请输入项目周期" type="number" v-model="form.p_cycle">
                                                    <template slot="append">
                                                        <el-select v-model="form.p_cycle_type" placeholder="请选择" style="width: 80px;">
                                                            <el-option
                                                            v-for="(item,index) in weekOpt"
                                                            :key="index"
                                                            :label="item.name"
                                                            :value="item.id">
                                                            </el-option>
                                                        </el-select>
                                                    </template>
                                                </el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="预算" prop="p_budget">
                                                <el-select v-model="form.p_budget" filterable placeholder="请选择或输入项目预算">
                                                    <el-option v-for="(item,index) in budgetOpt" :key="index" :label="item.name" :value="item.id">
                                                    </el-option>
                                                </el-select>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                </div>
                            </div>
                            <div class="panel mt_large">
                                <p class="item_title">合作倾向</p>
                                <div class="padding_16">
                                    <el-form-item label="希望与">
                                        <el-radio-group v-model="form.p_range">
                                            <el-radio v-for="(item,index) in rangeOpt" :key="index" :label="item.id">{{item.name}}</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                    <el-form-item label="地域">
                                        <el-select v-model="form.p_province" placeholder="请选择省市" @change="provinceChange">
                                            <el-option v-for="(item,index) in pervinceOpt" :key="index" :label="item.name" :value="item.id">
                                            </el-option>
                                        </el-select>
                                        <el-select v-model="form.p_city" placeholder="请选择省市" style="">
                                            <el-option v-for="(item,index) in cityOpt" :key="index" :label="item.name" :value="item.id">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>
                                </div>
                            </div>
                            <div class="panel mt_large">
                                <p class="item_title">联系信息</p>
                                <div class="padding_16">
                                    <el-form-item label="姓名：" prop="p_contacts_name">
                                        <el-input v-model="form.p_contacts_name" placeholder="请输入姓名"></el-input>
                                    </el-form-item>
                                    <el-form-item label="邮箱：" prop="p_contacts_email">
                                        <el-input v-model="form.p_contacts_email" placeholder="请输入邮箱"></el-input>
                                    </el-form-item>
                                    <el-form-item label="手机号：" prop="p_contacts_phone">
                                        <el-input v-model="form.p_contacts_phone" type="number" :maxlength=11 placeholder="请输入手机号码"></el-input>
                                    </el-form-item>
                                </div>
                            </div>
                            <div class="panel mt_large">
                                <p class="item_title">置顶</p>
                                <div class="padding_16">
                                    <el-form-item label="是否置顶">
                                        <el-radio-group v-model="form.p_is_roof">
                                            <el-radio v-for="(item,index) in roofOpt" :key="index" :label="item.id">{{item.name}}</el-radio>
                                        </el-radio-group>
                                    </el-form-item>
                                </div>
                            </div>
                            <el-form-item class="text-center" style="margin-top: 30px;">
                                <el-button class="btn_200" :type="editState?'primary':''" @click="onSubmit('form',1)">保存</el-button>
                                <el-button type="primary" @click="onSubmit('form',2)" class="btn_200" v-if="!editState">发布</el-button>
                            </el-form-item>
                        </el-form>
                    </el-col>
                    <el-col :span="6">
                        <div class="panel border_top_blue" style="margin-top: 20px;">
                            <p class="item_title title_41">发布流程</p>
                            <div class="padding_16 crowd_width">
                                <el-steps direction="vertical" :space="60" :active="1">
                                    <el-step v-for="(item,index) in stepData" :key="index" :title="item"></el-step>
                                </el-steps>
                            </div>
                        </div>

                        <div class="panel skill">
                            <h3>发布技巧</h3>
                            <h5>让需求发布到签约，快至 <span class="blods color-red">2</span> 小时搞定</h5>
                            <div class="padding_16 minh_50">
                                <div class="skill_row" v-for="(item,index) in publishSkill" :key="index">
                                    <p class="skill_label" style="font-size: 14px;">{{item.title}}</p>
                                    <p class="skill_item" style="font-size: 13px;color: #888;line-height: 24px;">{{item.describe}}</p>
                                </div>
                            </div>
                        </div>
                        
                        <div class="panel info_ser">
                            <router-link to="" class="displayB">
                                <img src="../../assets/images/info.png" width="100%" class="displayB" alt=""/>
                            </router-link>
                            <div class="padding_lr_14">
                                <div class="info__p">
                                    <p>1. 领取服务之星合作专用券，抵扣项目款</p>
                                    <p>2. 邀请服务之星合作独享5大服务保障</p>
                                    <p>3. 需求发布并通过审核，即可邀请或选择与服务之星合作</p>
                                </div>
                                <h5>第一次使用？遇到问题，需要帮助？</h5>
                                <el-row style="padding: 15px 0px;">
                                    <el-col :span="6">
                                        <img src="../../assets/images/u36444.png" width="56" height="51" class="displayB" alt="">
                                    </el-col>
                                    <el-col :span="18">
                                        <div class="info__tel">
                                            全国免费服务电话<br/><span>{{systemData.s_phone}}</span>
                                        </div>
                                    </el-col>
                                </el-row>
                            </div>
                        </div>

                    </el-col>
                </el-row>
            </div>
        </div>
    </div>
</template>
<script>

    import '../../assets/css/main.css'
    import '../../assets/css/projects.css'
    import {isvalidPhone,isvalidTel} from '../../assets/js/validate.js'


    var validPhone=(rule, value,callback)=>{
        if (!value){
            callback(new Error('请输入手机/电话号码'))
        }else  if (!isvalidPhone(value)){
            callback(new Error('请输入正确的11位手机号码'))
        }else {
            callback()
        }
    }

    var validchecked = (rule, value,callback)=>{
        if (!value){
            callback(new Error('请勾选发布协议'))
        }else{
            callback()
        }
    }

    export default {
        data(){
            return{
                form: {
                   p_name: '', 
                   p_content: '',
                   p_skills: '', 
                   p_skills_arr: [],  //技能要求  数组
                   p_cycle: '', 
                   p_cycle_type: 1, 
                   p_budget: '', 
                   p_range: 1, 
                   p_contacts_name: '', 
                   p_contacts_email: '', 
                   p_contacts_phone: '', 
                   p_enclosure: '', 
                   p_job_demand: '', 
                   p_job_demand_arr: [],  //岗位需求  数组
                   p_province: '', 
                   p_city: '', 
                   p_status: '', 
                   p_is_roof: 2, 
                },
                skillOpt: {},  //技能要求
                workOpt: {},  //岗位需求
                weekOpt: [  //周期单位
                    {'name': '天','id': 1},
                    {'name': '周','id': 2},
                    {'name': '月','id': 3},
                ],
                budgetOpt: [  //预算下拉
                    {'name': '3000以下','id': 1},
                    {'name': '3000-5000','id': 2},
                    {'name': '5000-10000','id': 3},
                    {'name': '10000-50000','id': 4},
                    {'name': '50000-100000','id': 5},
                    {'name': '100000 以上','id': 6},
                ],
                rangeOpt: [
                    {'name': '不限','id': 1},
                    {'name': '个人合作','id': 2},
                    {'name': '企业合作','id': 3},
                ],
                pervinceOpt: [],  //省下拉
                cityOpt: [],  //市下拉
                stepData: ['发布需求','筛选合适的接包方','签订电子合同、进入实施','验收完成'],
                publishSkill: [  //发布技巧
                    {'title': '清晰完整的需求，更容易评估报价','describe': '清晰完整的需求描述、明确的预算及要求，有利于接包方理解需求并提交可靠的竞标方案与报价。'},
                    {'title': '托管诚意保证金，更多接包方竞标','describe': '让需求更具吸引力，更多优质接包方参与竞标，有效加速需求签约与开发实施。'},
                ],
                systemData: {},  //客服信息
                editorOption: {
                    // placeholder设置提示词
                    placeholder: '请输入正文......',
                    // modules设置工具栏
                    modules: {
                        toolbar: [
                            ["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线
                            // ["blockquote", "code-block"], // 引用  代码块
                            // [{ header: 1 }, { header: 2 }], // 1、2 级标题
                            // [{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表
                            // [{ script: "sub" }, { script: "super" }], // 上标/下标
                            [{ indent: "-1" }, { indent: "+1" }], // 缩进
                            // [{'direction': 'rtl'}],                         // 文本方向
                            [{ size: ["small", false, "large", "huge"] }], // 字体大小
                            // [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
                            // [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
                            [{ font: [] }], // 字体种类
                            // [{ align: [] }], // 对齐方式
                            ["clean"], // 清除文本格式
                            // ["link", "image", "video"] // 链接、图片、视频
                        ]
                    }
                },
                formrules: {
                    p_name: [
                        { required: true, message: '请输入项目名称', trigger: 'blur' }
                    ],
                    p_content: [
                        { required: true, message: '请输入需求描述', trigger: 'blur' }
                    ],
                    p_skills_arr: [
                        { required: true, message: '请选择技能', trigger: 'change' }
                    ],
                    p_cycle: [
                        { required: true, message: '请输入项目周期', trigger: 'blur' }
                    ],
                    p_budget: [
                        { required: true, message: '请选择或输入项目预算', trigger: 'change' }
                    ],
                    p_contacts_name: [
                        { required: true, message: '请输入联系人姓名', trigger: 'blur' }
                    ],
                    p_contacts_email: [
                        { required: true, message: '请输入联系人邮箱', trigger: 'blur' },
                        { type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }
                    ],
                    p_contacts_phone: [
                        { required: true, message: '请输入联系人电话', trigger: 'blur' },
                        { required: true, trigger: 'blur', validator: validPhone },
                    ],
                },
                checked: false,
                roofOpt: [
                    {'name': '不置顶','id': 1},
                    {'name': '置顶','id': 2},
                ],
                appid: '',  //应用类型id
                appname: '',  //应用类型name
                editState: false,  //编辑页
                fileUidlist: [],  //change   url数组
                filefIdList: [],  //上传成功  id数组
                fileAllUidList: [],  //上传成功  url数组
                filelistarr: [],
                delarr: [],  //需要删除的附件id  arr
                isDel: false,
                alltotal: 0,
            }
        },
        methods: {
            //2发布  1保存
            onSubmit(formName,type) {

                var _this = this;

                _this.$refs[formName].validate((valid) => {
                    if (valid) {
                        
                        _this.form.p_skills = _this.form.p_skills_arr.join();
                        _this.form.p_job_demand = _this.form.p_job_demand_arr.join();
                        let data = {};
                        data.p_uid = window.localStorage.uid;
                        data.p_application_type = _this.appid;
                        data.p_status = type;

                        data.p_name = _this.form.p_name; 
                        data.p_content = _this.form.p_content;
                        data.p_skills = _this.form.p_skills;
                        data.p_cycle = _this.form.p_cycle; 
                        data.p_cycle_type = _this.form.p_cycle_type; 
                        data.p_budget = _this.form.p_budget; 
                        data.p_range = _this.form.p_range; 
                        data.p_contacts_name = _this.form.p_contacts_name; 
                        data.p_contacts_email = _this.form.p_contacts_email; 
                        data.p_contacts_phone = _this.form.p_contacts_phone; 

                        //添加  初始文件id
                        for(let i=0;i<_this.filelistarr.length;i++){
                            if(_this.filefIdList.indexOf(_this.filelistarr[i].id) == -1){
                                _this.filefIdList.push(_this.filelistarr[i].id);
                            }
                        }
                        
                        //删除    已删除的文件id
                        for(let i=0;i<_this.delarr.length;i++){
                            //请求接口  删除文件
                            _this.filefIdList.splice(_this.filefIdList.indexOf(_this.delarr[i]),1);
                            _this.delfile(_this.delarr[i]);
                        }
                        console.log(_this.filefIdList,'-------------最终');
                        //过滤上传失败的文件id
                        let idarr = [];
                        for(let i=0;i<_this.filefIdList.length;i++){
                            if(_this.filefIdList[i]){
                                idarr.push(_this.filefIdList[i]);
                            }
                        }

                        data.p_enclosure = idarr.join(','); 
                        data.p_job_demand = _this.form.p_job_demand; 
                        data.p_province = _this.form.p_province; 
                        data.p_city = _this.form.p_city; 
                        data.p_is_roof = _this.form.p_is_roof; 

                        //判断是修改还是新增
                        if(_this.editState){  //编辑

                            data.p_id = this.$route.query.pid;  //项目ID

                            // 提交
                            _this.$httpPost('/api/index/project/editProject',data).then(response => {
                                
                                if(response.code == 200){

                                    this.$message({
                                        message: response.msg,
                                        type: 'success'
                                    });

                                    setTimeout(function(){
                                        _this.$router.push({'path': '/readypushitem'})
                                    },2000)
                                    
                                }else if(response.code == 301){
                                    //无置顶权限，询问是否购买会员获得权限
                                    const h = this.$createElement;
                                    this.$msgbox({
                                        title: '购买',
                                        message: h('p', null, [
                                            h('span', null, response.msg),
                                            h('i', { style: 'color: teal' }, '购买会员即可获得置顶权限')
                                        ]),
                                        showCancelButton: true,
                                        confirmButtonText: '去购买',
                                        cancelButtonText: '取消',
                                        type: 'warning'
                                    }).then(action => {
                                        
                                        _this.$router.push({path: '/dashboard'});
                                        
                                    }).catch(() => {
                                
                                    });
                                }else{
                                    this.$message(response.msg);
                                }

                            });
                        }else{  //新增
                            // 提交
                            _this.$httpPost('/api/index/Project/addProject',data).then(response => {
                                
                                if(response.code == 200){

                                    this.$message({
                                        message: response.msg,
                                        type: 'success'
                                    });

                                    if(type == 1){  //保存
                                        
                                        setTimeout(function(){
                                            _this.$router.push({'path': '/readypushitem'})
                                        },2000)

                                    }else if(type == 2){  //发布

                                        setTimeout(function(){
                                            _this.$router.push({'path': '/senditem'})
                                        },2000)

                                    }
                                    
                                }else if(response.code == 301){
                                    //无置顶权限，询问是否购买会员获得权限
                                    const h = this.$createElement;
                                    this.$msgbox({
                                        title: '购买',
                                        message: h('p', null, [
                                            h('span', null, response.msg),
                                            h('i', { style: 'color: teal' }, '购买会员即可获得置顶权限')
                                        ]),
                                        showCancelButton: true,
                                        confirmButtonText: '去购买',
                                        cancelButtonText: '取消',
                                        type: 'warning'
                                    }).then(action => {
                                        
                                        _this.$router.push({path: '/dashboard'});
                                        
                                    }).catch(() => {
                                
                                    });
                                }else{
                                    this.$message(response.msg);
                                }

                            });
                        }
                        
                        

                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            init(){
                this.selectOpt(7);  //岗位需求
                this.selectOpt(4);  //技能要求
                this.pervinceFun();  //省下拉
                this.systemInfo();  //客服信息
 
                if(this.$route.query.pid){  //编辑页

                    this.itemDetail(this.$route.query.pid);
                    this.editState = true;

                }else{  //发布页

                    this.appid = this.$route.query.id;
                    this.appname = this.$route.query.name;
                    this.editState = false;

                }
            },
            //项目详情
            itemDetail(pid){

                var _this = this;

                this.$httpGet('/api/index/Project/projectDetail',{'p_uid': window.localStorage.uid,'p_id': pid}).then(response => {

                    if(response.code == 200){

                        _this.form.p_name = response.msg.p_name;
                        
                        _this.form.p_content = _this.escapeStringHTML(response.msg.p_content);
                        if(response.msg.p_job_demand){
                            _this.form.p_job_demand_arr = response.msg.p_job_demand.split(',');
                            _this.form.p_job_demand_arr = _this.strTonum(_this.form.p_job_demand_arr);
                        }

                        if(response.msg.p_skills){
                            _this.form.p_skills_arr = response.msg.p_skills.split(',');
                            _this.form.p_skills_arr = _this.strTonum(_this.form.p_skills_arr);
                        }
                        _this.appid = response.msg.p_application_type;  //应用类型ID
                        _this.appname = response.msg.st_name;
                        _this.form.p_cycle = response.msg.p_cycle;
                        _this.form.p_cycle_type = response.msg.p_cycle_type;
                        _this.form.p_budget = response.msg.p_budget;
                        _this.form.p_range = response.msg.p_range;
                        _this.form.p_province = response.msg.p_province;
                        _this.provinceChange(response.msg.p_province);
                        _this.form.p_city = response.msg.p_city;
                        _this.form.p_contacts_name = response.msg.p_contacts_name;
                        _this.form.p_contacts_email = response.msg.p_contacts_email;
                        _this.form.p_contacts_phone = response.msg.p_contacts_phone;
                        _this.form.p_is_roof = response.msg.p_is_roof;

                        //附件
                        for(var i = 0;i<response.msg.p_enclosure_name.length;i++){
                            _this.filelistarr.push({
                                'id': response.msg.p_enclosure_name[i].f_id,
                                'name': response.msg.p_enclosure_name[i].f_old_name + '.' + response.msg.p_enclosure_name[i].f_file_type});
                        }
                        // console.log(_this.filelistarr);
                        
                    }

                });

            },
            selectOpt(type){
                var _this = this;
                // 获取下拉
                this.$httpGet('/api/index/Skilltype/getSkillForStatus',{'st_type': type}).then(response => {

                    if(response.code == 200){

                        if(type == 4){  //技能要求
                            _this.skillOpt = response.msg;
                        }else if(type == 7){  //岗位需求
                            _this.workOpt = response.msg;
                        }
                    }

                });
            },
            //省下拉
            pervinceFun(){
                var _this = this;
                // 省下拉
                this.$httpGet('/api/index/Personal_center/pervincelist').then(response => {

                    if(response.code == 200){
                        
                        _this.pervinceOpt = response.msg;
                        
                    }

                });
            },
            // 省   change
            provinceChange(id){
                
                var _this = this;

                _this.form.p_city = '';
                // 市下拉
                this.$httpGet('/api/index/Personal_center/citylist',{'pid': id}).then(response => {

                    if(response.code == 200){
                        
                        _this.cityOpt = response.msg;
                        _this.form.p_city = response.msg[0].id;
                        
                    }

                });
            },
            //客服信息
            systemInfo(){
                var _this = this;
                // 客服信息
                this.$httpGet('/api/index/System/getSystemInfo').then(response => {

                    if(response.code == 200){
                        
                        _this.systemData = response.msg;
                        
                    }

                });
            },
            //文件上传之前的钩子
            beforeAvatarUpload(){
                var num = 0;
                for(let i=0;i<this.filelistarr.length;i++){
                    if(this.filefIdList.indexOf(this.filelistarr[i].id) == -1){
                        num++;
                    }
                }
                this.alltotal = 0;  //总上传数
                this.alltotal = parseInt(num) + parseInt(this.filefIdList.length) - parseInt(this.delarr.length);

                if(this.alltotal > 4){
                    this.$message({
                        message: '最多可上传5个文件',
                        type: 'warning'
                    });
                    this.alltotal = -1;
                    this.isDel = true;
                    return false;
                }else{
                    this.isDel = false;
                }
                
            },
            //覆盖默认的上传行为，可以自定义上传的实现
            UploadImage(param){
                
                const formData = new FormData();
                formData.append('files', param.file);
                formData.append('uid', window.localStorage.uid);

                var _this = this;
                // 上传附件
                this.$httpPost('/api/index/Project/uploadfiles',formData).then(response => {
                    console.log(response);
                    if(response.code == 200){
                        
                        this.$message({
                            message: response.msg,
                            type: 'success'
                        });

                        param.onSuccess(response.fid);

                    }else if(response.code == 301){
                        this.$message({
                            message: response.msg,
                            type: 'warning'
                        });
                        
                    }else{
                        this.$message({
                            message: response.msg,
                            type: 'warning'
                        });
                    }

                }).catch(response => {
                    
                    this.$message({
                        message: response.msg,
                        type: 'error'
                    });
                });

            },
            //删除附件
            handleRemove(file, fileList){
                
                var _this = this;
                var sub = this.fileUidlist.indexOf(file.uid);  //下标
                if(sub != -1 && !this.editState){  //添加页    或者   编辑页但有上传新得附件
                    if((this.alltotal != -1) || !this.isDel){
                        //正常操作移除
                        //请求接口  删除文件
                        _this.delfile(this.filefIdList[sub]);
                        
                        _this.fileAllUidList.splice(sub,1);
                        _this.fileUidlist.splice(sub,1);
                        _this.filefIdList.splice(sub,1);
                    }else{
                        //超出上传文件个数移除
                        this.alltotal = -1;
                        this.isDel = false;
                    }

                }else{  //编辑页   删除该项目原始图片
                    
                    for(var i=0;i<_this.filelistarr.length;i++){
                        if(_this.filelistarr[i].id == file.id){
                            
                            _this.delarr.push(_this.filelistarr[i].id);
                            
                        }
                    }
                }
                
            },
            //删除附件
            delfile(picid){
                this.$httpGet('/api/index/Project/delFiles',{'f_id': picid}).then(response => {

                    if(response.code == 200){

                    }else{
                        this.$message({
                            message: response.msg,
                            type: 'warning'
                        });
                    }

                });
            },
            //附件  change
            uploadChange(file,fileList){
                
                this.fileUidlist = [];
                for(var i=0;i<fileList.length;i++){
                    this.fileUidlist.push(fileList[i].uid);
                }
                
            },
            //上传成功
            uploadSuccess(response, file, fileList){
                
                this.filefIdList = [];
                this.fileAllUidList = [];
                for(var i=0;i<fileList.length;i++){
                    if(fileList[i].response){
                        this.filefIdList.push(fileList[i].response);
                    }else{
                        this.filefIdList.push(fileList[i].id);
                    }
                    this.fileAllUidList.push(fileList[i].uid);
                }
            },
            //字符串数组转换为数字数组
            strTonum(arr){
                var numarr = [];
                arr.map(function(data){ 
                    numarr.push(parseInt(data));
                });
                return numarr;
            },
            //解析编辑器内容
            escapeStringHTML(str) {
                str = str.replace(/&amp;/g,'&');
                str = str.replace(/&lt;/g,'<');
                str = str.replace(/&gt;/g,'>');
                str = str.replace(/&quot;/g,'"');
                return str;
            },
        },
        mounted(){
            this.init();
        },
    }
</script>
<style lang="less">
    .ql-editor {
        min-height: 270px !important;
        line-height: 26px;
        color: #222222;
    }
    .ql-snow .ql-picker-label::before{
        vertical-align: top;
    }
</style>